<template>
	<view>
		<u-navbar :border-bottom="false" ></u-navbar>
		<view class="upload-img">
			<img-upload @chooseImage = "chooseImage" @delImg="delImg"></img-upload>
		</view>
		<view class="title">
			<textarea type="text" auto-height value="" v-model="title"  placeholder="填写标题会收获很多赞哦~~" placeholder-style="font-size:32rpx"/>
		</view>
		<view class="content">
			<textarea value="" v-model="dkdnr" placeholder="添加正文内容" placeholder-style="font-size:32rpx" />
		</view>
		<view class="cate">
			<view class="icon-text">
				<u-icon name="fenlei" custom-prefix="custom-icon" size="30" color="#000" style="margin-right: 23rpx;"></u-icon>选择分类
			</view>
			<view class="cate-list-wrap u-flex">
				<block v-for="(item,index) in cateArr" :key="item.id">
					<view class="cate-list u-flex u-row-center u-col-center" :class="index == current?'cate-list-active':''" @click="chooseCate(item,index)">
						{{item.name}}
					</view>
				</block>
			</view>
		</view>
		<view class="address u-flex u-row-between" @click="chooseLocation">
			<view class="u-flex u-col-center">
				<view class="">
					<u-icon name="weizhi" custom-prefix="custom-icon" size="40" color="#000" style="margin-right: 23rpx;"></u-icon>
					<!-- {{showTitle?showTitle:'河南 南阳'}} -->
				</view>
				<view class="">
					{{address || '请选择位置'}}
				</view>
			</view>
			<view class="">
				<u-icon name="arrow-right" size="30" color="#999"></u-icon>
			</view>
			
		</view>
		<u-button class="custom-style" type="error" shape="circle" @click="submit">发布</u-button>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import ImgUpload from "@/components/common/img-upload.vue"
	import {commonGet} from "@/api/commonapi.js"
	export default {
		components:{
			ImgUpload
		},
		data() {
			return {
				title:"",  //标题
				dkdnr:"",  //内容
				colid:"",  //分类
				$baseUrl:"",
				cateArr:[],
				current:0,
				address:"",
				dkdtp:[],
				latitude:"", //纬度
				longitude:""  //经度
			}
		},
		onLoad(){
			this.$baseUrl = this.baseUrl
			this.getCate()
		},
		computed: {
		   
		},
		watch:{
			
		},
		methods: {
			chooseLocation(){
				let _this = this
				uni.chooseLocation({
				    success: function (res) {
						_this.address = res.address
						_this.latitude = res.latitude
						_this.longitude = res.longitude
				    }
				})
			},
			// 上传图片
			chooseImage(arr){
				this.dkdtp = arr
			},
			// 删除图片
			delImg(arr){
				this.dkdtp = arr
			},
			getCate(){
				let query = {
					ak:this.$store.state.token,
					cmd:"mDynamicColumn_list",
					para:JSON.stringify({})
				}
				commonGet(query,(result)=>{
					this.cateArr = result.Data.Data
				})
			},
			chooseCate(item,index){
				this.current = index
				this.colid = item.id
			},
			submit(){
				let _this = this
				if(_this.dkdtp.length == 0){
					_this.$refs.uToast.show({title:"请上传图片"})
				}else if(_this.title .trim()== ""){
					_this.$refs.uToast.show({title:"请输入标题"})
				}else if(_this.dkdnr.trim() == ""){
					_this.$refs.uToast.show({title:"请输入正文内容"})
				}else if(_this.colid == ""){
					_this.$refs.uToast.show({title:"请选择分类"})
				}else if(_this.address == ""){
					_this.$refs.uToast.show({title:"请选择位置"})
				}else{
					let query = {
						ak:this.$store.state.token,
						cmd:"mDynamic_add",
						para:JSON.stringify({
							pageid:"3354",
							"id":"",
							"colid":_this.colid,
							"title":_this.title,
							"dkdtp":JSON.stringify(_this.dkdtp),
							"dkmrtp":_this.dkdtp[0].lj,
							"dttype":"0",
							"dkdnr":_this.dkdnr,
							"zbx":_this.latitude,
							"zby":_this.longitude,
						})
					}
					commonGet(query,(result)=>{
						if(result.ResponseID == 0 || result.Message){
							_this.$refs.uToast.show({
								title:"发布成功",
								type: 'success',
								back:true,
								isTab:true
							})
						}
					})
				}
			}
			
		}
	}
</script>

<style lang="scss" scoped>
	.custom-style{
		color: #fff;
		background-color: #c40200;
		width: 406rpx;
		height: 92rpx;
		border-radius: 92rpx;
		margin: 116rpx auto;
		font-size: 30rpx;
	}
.upload-img{
	padding: 40rpx 30rpx;
}
.title{
	margin: 0 30rpx;
	padding-bottom: 40rpx;
	border-bottom: 1px solid #e5e5e5;
	textarea{
		width: 100%;
		font-size: 32rpx;
	}
}
.content{
	margin: 0 30rpx;
	padding: 40rpx 0;
	border-bottom: 1px solid #e5e5e5;
	textarea{
		width: 100%;
		height: 215rpx;
		font-size: 32rpx;
	}
}
.cate{
	margin: 40rpx 30rpx;
	padding-bottom: 14rpx;
	border-bottom: 1px solid #e5e5e5;
	.icon-text{
		font-size: 30rpx;
		font-weight: bold;
		margin-bottom: 42rpx;
	}
	.cate-list-wrap{
		flex-wrap: wrap;
		.cate-list{
			width: 142rpx;
			height: 54rpx;
			border-radius: 54rpx;
			border: 1px solid #e5e5e5;
			font-size: 24rpx;
			font-weight: bold;
			margin-bottom: 28rpx;
			margin-right: 30rpx;
		}
		.cate-list-active{
			color: #c40200;
			border: 1px solid #c40200;
		}
	}
}
.address{
	margin: 0 30rpx;
	padding-bottom: 40rpx;
	border-bottom: 1px solid #e5e5e5;
	font-size: 30rpx;
	font-weight: bold;
}




</style>
